/*Global styles*/
.l-hidden
{
    visibility: hidden;
}

.l-displaynone
{
    display: none!important;
}

.l-display
{
    display: block!important;
}

.l-title
{
    display: block;
    font-size: 16px;
    margin: 0.6em 90px 0.8em;
    min-height: 1.1em;
    outline: 0 none !important;
    overflow: hidden;
    padding: 0;
    text-align: center;
    white-space: nowrap;
}

.l-footer
{
    position: absolute!important;
    z-index:999; 
    bottom:0; 
    left:0; 
}

.l-warning-box
{
    height: 1em;
}

.l-warning-chat
{
    position: relative;
    font-size: small;
    color:orangered;
}

.l-warning
{
    float: none!important;
    position: absolute;
    left: 55%;
    top: 5%;
    width: 45%;
    font-size: small;
    color:orangered;
}

.l-content
{
    min-height:265px;
    padding-top: 5px!important;
}
.l-inset-content
{
    padding-left: 2px!important;
    padding-right: 2px!important;
    /*    margin-top: -1em!important;*/
}

.l-button-inactive
{
    background:inherit!important;
    border:inherit!important;
}

.l-neighbour,.l-mine,.l-friend
{
    /*    height:310px;*/
}

/*Styles for displaying thumbnail*/
.l-frame
{
    border: none;
    border-radius:10px;
    float: left;
    margin-right: 5px;
}

/*Styles for displaying thumbnail*/
.l-thumbnail
{
    width: 60px;
    height: 60px;
    background-image: url(../images/avatar.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    float: left;
}

/*Styles for displaying avatar*/

.l-avatar
{
    width: 78px;
    height: 78px;
    max-height:78px !important;
    max-width: 78px !important;
    background-image: url(../images/avatar.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*    margin-left: auto;
        margin-right: auto;*/
}

.l-avatar h4
{
    font-size: smaller;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis;
    margin-top:60px;
    margin-bottom:0;
}

.l-avatar h4, .l-avatar .l-status p
{
    text-shadow:  0 1px #fff, 0 -1px 0 #fff, 1px 0 0 #fff, -1px 0 0 #fff,2px 2px 1px #fff!important;
    text-shadow: 2px 2px 2px #fff;
}

.l-status
{
    float:left;
    margin: 1px 0 0 1px;
}

.l-status img
{
    width: 15px;
    height:15px;
    float:left;

}

.l-status p
{
    display: block;
    width:60px;
    float:left;
    font-size: smaller!important;
    font-weight:normal;
    margin-top:-1px;
    text-align: right;
}

/*Styles for gridview*/
.l-neighbour
{
    overflow: hidden;
}

.l-slide
{
    position:relative; 
}

.l-grid
{
    margin-left:-15px;
    margin-right: -15px;
    /*    margin-top:-10px;*/
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
}

.l-grid h4, p
{
    text-decoration: none!important;
    -webkit-text-decorations-in-effect: none;
}

.l-dot-line
{
    margin-top:5px;
    text-align: center;
    margin-bottom:-5px;
}

.l-dot-line img
{
    margin-left:3px;
}

/*Styles for listview*/
.l-list
{
    margin-top:0px !important;
    text-align: center;
}
.l-list-smallpad
{
    margin: 5px 0 -5px 0!important;

}

.l-list-smallpad li
{
    padding: 10px!important;
}

.l-list-item
{
    padding-right: 5px !important;
    max-height: 80px;
}

.l-list-item div:first-child
{
    height: 100%;
}

.l-list-item a p
{
    margin-top:3px;
    /*    white-space: !important;*/
}

.l-people
{
    width: 100%;
    /*    height: 100%;*/
    text-align: center;
}

.l-people a
{
    display: inline-block;
}

.l-shadowbox
{
    border:white solid 1px;
}


/*Style for displaying personal information*/
.l-photo
{
    width:285px;
    height:285px;
    margin-left: auto;
    margin-right:auto;
    /*Default photo to be changed*/
    background-image: url(../images/avatar.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size:content;
}

.l-photo img
{
    display: block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
}

.l-brief
{
    width: 100px;
    margin-left: 10px;
    white-space: nowrap;
    text-overflow:ellipsis;
}

.l-brief p:first-child
{
    margin-top: 0;
}

.l-detail li
{
    padding-right:15px!important;
}

.l-detail li.l-li-photo
{
    padding: 3px 0!important;
}

.l-detail label
{
    display: inline-block;
    margin-top: 0.3em;
}


.l-edit label
{
    float: left;
}

.l-edit li div.ui-select
{
    width: auto!important;
    display: inline-block!important;

}

.l-edit li div.ui-select div.ui-btn
{
    margin: 0;
}

.l-edit li div.ui-select span.ui-btn-inner
{
    padding-left: 10px;
    padding-right: 35px;
}

.l-detail label:first-child
{
    width: 20%;
    margin-left: -3%;
    text-align: center;
    margin-top: 0.6em;
}

.l-detail li textarea
{
    width: 75%!important;
}

.l-detail li input,fieldset
{
    width: 75%;
}

.l-detail li textarea
{
    height: 8em;
}


.l-detail li fieldset
{
    /*    width: 74%!important;*/
    font-size: medium;
}

.l-detail li fieldset input
{
    width: 100%!important;
}

.l-detail li.l-select-age div.ui-select
{
    width: 40%!important;
    display: inline-block!important;
}

.l-detail li.l-select-age div.ui-field-contain
{
    width: 80%;
    margin: 0!important;
    display: inline-block;
}

label.l-select-between
{
    float: none!important;
    margin-top: -1em;
}


.l-taglist div
{
    background: none!important;
    background-image: none!important;
    background-color: #F0F0F0!important;
    width: 74%!important;
    margin-bottom: 5px;
    border-radius: 0.6em 0.6em 0.6em 0.6em!important;
    padding-left: 0.4em;
}

.l-taglist div a
{
    right: -18%!important;
}

.l-taglist #new_tag + a .ui-icon
{
    background-position:0px!important;
}

.l-taglist #new_tag + a
{
    visibility: visible!important;
}

.l-taglist div:last-child
{
    visibility: hidden;
}

.l-number
{
    display:table!important;
    width: 15%!important;
}

.l-number + label
{
    position: absolute;
    left: 40%;
    top: 17%;
    width: 12%;
}

.l-slider div
{
    width: 55%!important;
}

a.l-button
{
    margin-left:18%!important;
    margin-top: 3%!important;
}

.l-button
{
    margin:0 0 0 10%!important;
}

.l-button span
{
    padding: 0.3em 0.2em!important;
}

.l-button div.ui-radio input
{
    visibility: hidden;
}

.l-describe
{    
    display:inline-block;
    width: 80%;
}

.l-select
{
    display:inline-block;
    width: 40%;
}

#search_bar
{
    float: left;
    margin: 0.3em 0!important;
    padding:0 1em 0 1em;
    width: 65%;
}

#search_bar input
{
    height: 1em;
}

#search_bar
{
    float: right;
    margin-top: 0.7em;
    margin-right: 1em;
}

/* For search.php*/
.l-distance fieldset
{

}

.l-li-aside
{
    position: absolute!important;
    right: 28%;
    text-align: center;
    top: 10px;
    z-index: 999;
}

/* For status.php*/

.l-intro
{
    min-height: 80px;
    padding-right: 0.5em!important;
    padding-left: 0.5em!important;

}

.l-tweet
{
    padding-right: 0.5em!important;
    padding-left:0.5em!important;
}

.l-tweet-content
{
    margin-right: 0;

}

.l-tweet > .l-tweet-content > p
{
    display:inline-block!important;
    width: 80%;
    white-space: normal;
}

.l-tweet-button
{
    margin-top: -1em;
    display: inline-block;
    width: 15%;
    z-index: 1000;
    text-align: right;
    font-size: small!important;

}

.l-button-show
{
    top: 2em;
}

.l-button-add
{
    bottom: 2em;
}

.l-tweet-button a span span
{
    font-size: smaller!important;
}

.l-tweet-comment
{
    border-top: 1px gray solid;
}

.l-tweet-comment p
{
    margin-top: 0!important;
    white-space: normal!important;
    display: block;
}

.l-tweet-reply
{
    margin: 5px 0 0 0.5em;
    min-height: 65px;
    border-bottom:1px gray solid;

    height: auto;

}

.l-tweet-reply img.avatar
{
    float: left;
    height: 60px;
    width: 60px;
}

.l-tweet-reply-content
{
    width: 70%;
    float: left;
}

.l-tweet-comment textarea
{
    margin-top: 5px;
    margin-right: -3%;
    width: 78%;
    font-size: small;
    display: inline-block!important;

}

.l-tweet-comment.l-invalid textarea
{
    color: gray;
}

/* For #neighbour_content*/
#neighbour_content .l-avatar
{
    margin-left: auto;
    margin-right: auto;
}

.l-inset
{
    /*    margin:-5px!important;*/
}

.l-block-center a
{
    margin-left: auto!important;
    margin-right: auto!important;
    display: inline-block;
}

#tweet_form
{
    width: auto;
}

.l-button-right
{
    position: absolute;
    width: 15%;
    right: 0.5em;
    top: 1em;
    margin: 0!important;
}

.l-button-right span
{
    padding-left:0!important;
    padding-right:0!important;
}

#new_tweet{
    font-size: 13px;
    height: 2em !important;
    width: 78% !important;
}
.l-photo-contain
{
    padding-left: 2px!important;
    padding-right: 2px!important;
}

#rigisterResult{
    font-size: 0.7em;
}

#tweet,#information{
    display: block;
}
